<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<script type="text/javascript" src="js/jquery-3.3.1.js"></script>
		<script type="text/javascript" src="js/bootstrap.js"></script>
		<link rel="stylesheet" href="css/bootstrap.css" />
	</head>

	<body>
		<!--垂直/基本表单-->
		<form role="form">

			<div class="form-group">
				<label for="name">名称</label>
				<input type="text" class="form-control" id="name" placeholder="请输入名称">
			</div>

			<div class="form-group">
				<label for="inputfile">文件输入</label>
				<input type="file" id="inputfile">
				<p class="help-block">这里是块级帮助文本的实例。</p>
			</div>

			<div class="checkbox">
				<label>
      				<input type="checkbox"> 请打勾
      			</label>
			</div>
			<button type="submit" class="btn btn-default">提交</button>
		</form>

		<!--内联表单-->
		<form class="form-inline" role="form">

			<div class="form-group">
				<label for="name">名称</label>
				<input type="text" class="form-control" id="name" placeholder="请输入名称">
			</div>

			<div class="form-group">
				<label for="inputfile">文件输入</label>
				<input type="file" id="inputfile">
				<p class="help-block">这里是块级帮助文本的实例。</p>
			</div>

			<div class="checkbox">
				<label>
      				<input type="checkbox"> 请打勾
      			</label>
			</div>
			<button type="submit" class="btn btn-default">提交</button>
		</form>

		<!---水平表单-->
		<form class="form-horizontal" role="form">
			<div class="form-group">
				<label for="firstname" class="col-sm-2 control-label">名字</label>
				<div class="col-sm-4">
					<input type="text" class="form-control" id="firstname" placeholder="请输入名字">
				</div>
			</div>
			<div class="form-group">
				<label for="lastname" class="col-sm-2 control-label">姓</label>
				<div class="col-sm-10">
					<input type="text" class="form-control" id="lastname" placeholder="请输入姓">
				</div>
			</div>
			<div class="form-group">
				<div class="col-sm-offset-2 col-sm-10">
					<div class="checkbox">
						<label><input type="checkbox"> 请记住我</label>
					</div>
				</div>
			</div>
			<div class="form-group">
				<div class="col-sm-offset-2 col-sm-10">
					<button type="submit" class="btn btn-default">登录</button>
				</div>
			</div>
		</form>

	</body>
</html>